<!--周建威 -->
<!--2017/12/20 -->
<template>
    <div>
        <el-row >
            <el-col>
                <el-form  :model="form" class="demo-form-inline">
                    <el-form-item label="缓存">
                        <el-checkbox-group v-model="form.labels">
                            <el-checkbox  v-for="(value,key) in cacheList" :label="key" :key="key">{{value}}</el-checkbox>
                        </el-checkbox-group>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="handleDelete" :disabled="form.labels.length==0 ">清除</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
    </div>
</template>
<script>
  import {getCacheList, deleteCaches} from '../../api/api'
  export default {
    data () {
      return {
        cacheList: {},
        form: {
          labels: []
        }
      }
    },
    methods: {
      handleCacheList () {
        getCacheList({}).then(res => {
          this.cacheList = res.data
        })
      },
      handleDelete () {
        deleteCaches(this.form).then(res => {
          if (parseInt(res.status) === 1) {
            this.$message({
              message: '清除成功',
              type: 'success'
            });
          } else {
            this.$message({
              message: '清除失败',
              type: 'error'
            });
          }
        })
      }
    },
    mounted () {
      this.handleCacheList();
    }
  }
</script>
<style scoped rel="stylesheet/sass" lang="sass">
    .el-row
        padding: 20px
        margin-top: 10px

</style>